<template>
  <div class="topbar">
    <!-- LOGO -->
    <div class="topbar-left">
      <a class="logo" href="/">
        <span>
          Tao
          <span>yun</span>
        </span>
        <i class="zmdi zmdi-layers"></i>
      </a>
    </div>

    <!-- Button mobile view to collapse sidebar menu -->
    <div class="navbar navbar-default" role="navigation">
      <div class="container">
        <!-- Page title -->
        <ul class="nav navbar-nav navbar-left">
          <li>
            <button class="button-menu-mobile open-left">
              <i class="zmdi zmdi-menu"></i>
            </button>
          </li>
          <li>
            <h4 class="page-title">
              <span class="ti-home"></span>
              <span class="ti-angle-right" style="margin-right:15px"></span>
            </h4>
          </li>
        </ul>

        <!-- Right(Notification and Searchbox -->
        <ul class="nav navbar-nav navbar-right">
          <li>
            <!-- Notification -->
            <div class="notification-box">
              <ul class="list-inline m-b-0" style="padding-top:20px">
                <li>
                    <el-button type="info" @click="jump_to_manage" v-if="this.userInfo.permission=='管理员' || this.userInfo.permission=='超管'">人员管理</el-button>
                </li>
                <li>
                    <el-button type="info" @click="jump_to_settings">个人中心</el-button>
                </li>
              </ul>
            </div>
            <!-- End Notification bar -->
          </li>
        </ul>
      </div>
      <!-- end container -->
    </div>
    <!-- end navbar -->
  </div>
</template>


<script>
export default {
  data() {
    return {};
  },
  props:["userInfo"],
  methods:{
    jump_to_manage(){
        this.$store.commit("set_token", window.localStorage.getItem("tokenLogin"));
        this.$axios.get('/api/taoyun/v1/getUser')
          .then((res) => {
            if (res.data.code == "200") {
              this.userInfo = res.data.data;
              this.$store.commit("set_info", this.userInfo.userId);
              this.$store.commit("set_department", this.userInfo.department);
              this.$router.push({
                path: 'manage/workerinfo'
              });
              if (window.localStorage.getItem("list")) {
                this.$store.replaceState(Object.assign({}, this.$store.state, JSON.parse(window.localStorage.getItem("list"))))
              }
              window.addEventListener("beforeunload", () => {
                window.localStorage.setItem("list", JSON.stringify(this.$store.state))
              })
            } else if (res.data.code == "500") {
              this.jump_to_login();
            }
          })
          // 接口改动  会直接出现500的err  不会出现json->data->code=500 的情况
          .catch((err) => {
            this.jump_to_login();
          });
    },
    jump_to_settings(){
        this.$router.push({path: 'Settings'});
    },
    jump_to_login() {
       let that = this;
       this.open_error("认证已经过期,跳转到登录页面");
       setTimeout(function() {
         that.$router.push({
           path: "/signin"
         });
       }, 0)
     },
  },
};
</script>
